<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
<title>协议弹窗</title>
<style>
html,body {width: 100%;height: 100%padding: 0; margin: 0; animation:fadeIn 0.3s;-webkit-animation:fadeIn 0.3s;}

@-webkit-keyframes fadeIn {from {opacity:0.1;}}
@-moz-keyframes fadeIn {from {opacity:0.1;}}
@keyframes fadeIn {from {opacity:0.1;}}

.tapcss{ background-color: #eee;}
.flex {display:-webkit-box;display:-moz-box;display:-ms-flexbox;display:-webkit-flex;display:flex;}
.flex1 {-webkit-box-flex:1;-moz-box-flex:1;-webkit-flex:1;-ms-flex:1;flex:1;}

/*半像素边框*/
.boxbg{ background: rgba(0, 0, 0, 0.3);position: fixed; z-index:1; top: 0; bottom: 0; right: 0; left: 0; }
.box{ background-color: #fff; width: 275px; height:344px;position: fixed; z-index:10; top: 0; bottom: 0; right: 0; left: 0; margin:auto;}
.box .title {height: 45px; line-height: 45px; text-align: center; color: #333333;font-weight:600;font-size: 16px;}
.box .del{width: 22px;height: 22px;position: relative;top: -53px;left: 262px;}
.box .del img{width: 100%;}
.box .con {color: #777777; font-size: 14px; padding: 0px 12px; line-height: 20px;}
.box .btm { height: 52px; line-height: 52px; position: absolute; bottom: 0px; left: 0px; right: 0px;}
.box .btm .item{text-align: center; color:#E75229; font-size:16px; position: relative;font-weight: 600;}
.box .btm .item:before{content:" ";position:absolute;left:0;top:-0.03rem;right:0;border-top:1px solid rgba(177,177,177,0.6);color:rgba(177,177,177,0.6);-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleY(0.2);transform:scaleY(0.2);}
.box .btm .item:nth-child(2):after{content:" ";position:absolute;left:-0.03rem;top:0;bottom:0;border-right:1px solid rgba(177,177,177,0.6);color:rgba(177,177,177,0.6);-webkit-transform-origin:0 0;transform-origin:0 0;-webkit-transform:scaleX(0.2);transform:scaleX(0.2);}
.box .btm .color_1{color:#666666;}
.box .btm .color_0{color:#FF9502;}

</style>
</head>
 <body>
<div id="warp" >
    <div class="boxbg"></div>
	<div class="box">
		<div class="title" id="title">用户协议</div>
		<div class="del"><img src="../../image/main0/del_pop.png"/></div>
		<div class="con">
		    <span id="content">
		    	感谢您信任并使用逸果商城 <br /><br />
				我们非常重视您的个人信息和隐私保护。为了更好的保证您的个人权益，在您使用我们的品前，请认真阅读《用户协议》中的全部内容，同意并接受全部条款后开始使用我们的产品和服务。<br /><br />
				若选择不同意，将无法使用我们的产品和服务，并会退出应用。
		    </span>
		</div>
		<div class="btm flex" id="button">
			<div class="lf item flex1 color_1" tapmode="tapcss" onclick="clickQuXiao(this)">不同意退出</div>
			<div class="rt item flex1 color_0"  tapmode="tapcss" onclick="clickOk(this)">同意</div>
		</div>
	</div>
</div>
</body>
<script type="text/javascript">
var Pdata;
apiready = function() {
//	Pdata = api.pageParam;
//  var tit = document.getElementById('title');
//  var con = document.getElementById('content');
//  var but = document.getElementById('button');
//  tit.textContent = Pdata.title;
//  con.textContent = Pdata.content;
//  var bnt = '';
//  if(Pdata.button && Pdata.button.length > 0){
//      for (var i = 0; i < Pdata.button.length; i++) {
//          bnt +='<div class="rt item flex1 color_'+i+'" tapmode="tapcss" data-index="'+i+'" onclick="bntClick(this)">'+Pdata.button[i]+'</div>';
//      }
//  }else{
//      bnt = '<div class="rt item flex1" tapmode="tapcss" data-index="0" onclick="bntClick(this)">确认</div>';
//  }
//  but.innerHTML = bnt;
};
function bntClick(tis){
    var dst = tis.dataset;
    api.execScript({frameName:Pdata.topFname, script: 'nowDialogCallback('+JSON.stringify(dst)+')'});
	api.closeFrame({name: Pdata.fname});
}
</script>
</html>
